<template>
	<view class="u-padding-20">
		<view class="shadow_con u-padding-20 u-rela">
			<view class="list">
				借用工具：{{detail.tool}}
			</view>
			<view class="list">
				取用方式：<text style="color:#000;">{{detail.type==0?'物业配送':'自提'}}</text>
			</view>
			<view class="list">
				预约时间：{{detail.create_time}}
			</view>
			<view class="list">
				使用时间：{{detail.time}}
			</view>
			<view class="list">
				使用地址：{{detail.address}}
			</view>
			
			<view style="color:#007AFF;" class="u-abso dis_inl_blo pos_right pos_top">
				{{detail.status_label}}
			</view>
		</view>
		<view class="shadow_con u-padding-20 u-margin-top-20 u-rela">
			<view class="list">
				联 系 人：{{detail.name}}
			</view>
			<view class="list">
				联系电话：{{detail.tel}}
			</view>
			<u-icon style="bottom:30rpx;" class="u-abso pos_right" color="#008b00" name="phone-fill" size="40" @click="makephone(detail.tel)"></u-icon>
		</view>
		<view class="list u-margin-top-20" v-if="detail.status!=0">
			工单信息
		</view>
		<view class="shadow_con u-padding-20 u-margin-top-20 u-rela" v-if="detail.status!=0">
			<view class="list">
				负责人：{{detail.examine.author}}
			</view>
			<view class="list">
				进度时间：{{detail.examine.update_time}}
			</view>
			<view class="list" v-if="detail.examine.express_memo">
				取用/配送备注：{{detail.examine.express_memo}}
			</view>
			<view class="list" v-if="detail.examine.express_image">
				取用/配送图片：
				<image class="dis_blo margin_auto u-margin-top-20" style="width:50%" :src="detail.examine.express_image" mode="widthFix"></image>
			</view>
		</view>
		<!-- 配送/取用内容 -->
		<view v-if="detail.status==2" class="shadow_con u-padding-20 u-margin-top-20">
			<view class="list" style="color:#0c838b;">取用/配送备注</view>
			<view class="price_intro">
				<textarea v-model="memo" value="" placeholder="请简单描述" />
			</view>
			<view class="uni-flex-center">
				<view class="list">取用/配送上传图片：</view>
				<u-upload class="margin_auto" :action="action" @on-success="successimg" on-remove="deletePic" :file-list="fileList" maxCount="1"></u-upload>
			</view>
			<button class="u-margin-top-40 u-margin-bottom-40 btn_con" @click="express(detail.id)">确认取用/配送</button>
		</view>
		
		<view v-if="detail.status==0" style="margin-top:100rpx;" class="u-padding-15 u-text-center">
			<u-button class="u-margin-right-50" type="success" shape="circle" size="medium" @click="torelease">审核通过</u-button>
			<u-button type="warning" shape="circle" size="medium" @click="toNorelease">审核拒接</u-button>
			
		</view>
		<view v-if="detail.status==1" style="margin-top:100rpx;" class="u-padding-15 u-text-center">
			<button class="u-margin-top-40 u-margin-bottom-40 btn_con" @click="returnback">确认归还</button>
		</view>
		<u-modal v-model="show" :content="content" @confirm="confirm(detail.id)" show-cancel-button=true></u-modal>
		<!-- 弹框提示 -->
		
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	import {
		getAdjacentToolsDetail,
		examineAdjacentTools,
		expressAdjacentTools,
		returnAdjacentTools
	} from "@/service/shareService.js";
	export default {
		data () {
			return {
				status:0,
				id:0,
				detail:{},
				color:'#333',
				show:false,
				isagreeStatus:1,
				memo:'',
				fileList:[],
				image:'',
				action:'https://admin.gslhzhwy.com/api/upload/file',
				content:'',
				isreturn:1
			}
		},
		onLoad(options) {
			this.id=options.id
			getAdjacentToolsDetail({
				id: options.id
			}).then(this.getDetail);
		},
		methods:{
			getDetail(e) {
				// console.log(e);
				if(e.code == 200){
					this.detail = e.result;
					if(e.result.status==0){
						this.color='#007AFF'
					}else if(e.result.status==1){
						this.color='#00aa00'
					}else if(e.result.status==2){
						this.color='#ff0000'
					}else if(e.result.status==-1){
						this.color='#ff5500'
					}
				}
			
				
			},
			successimg:function(e){
				if (e.code == 1) {
					this.image=e.data.url;
				}
			},
			torelease:function(){
				this.show=true;
				this.content='该信息符合借用条件，予以审核通过';
				this.isreturn=1;
				this.isagreeStatus=1;
			},
			toNorelease:function(){
				this.show=true;
				this.content='该信息不符合借用条件，不予以通过';
				this.isreturn=1;
				this.isagreeStatus=-1;
			},
			returnback:function(){
				this.show=true;
				this.isreturn=2;
				this.content='检查物品正常，确认归还';
			},
			confirm:function(e){
				if(this.isreturn==1){
					examineAdjacentTools({
						id:this.id,
						status:this.isagreeStatus
					}).then(res=>{
						if(res.code==200){
							this.show=false;
							this.$refs.uToast.show({
								type: 'success',
								title: '操作成功',
								icon:false
								// message: e.msg,
							})
							getAdjacentToolsDetail({
								id: this.id
							}).then(this.getDetail);
						}else{
							this.show=false;
							this.$refs.uToast.show({
								type: 'error',
								title: res.msg,
								icon:false
								// message: e.msg,
							})
						}
					});
				}else if(this.isreturn==2){
					returnAdjacentTools({
						id:this.id
					}).then(res=>{
						if(res.code==200){
							this.show=false;
							this.$refs.uToast.show({
								type: 'success',
								title: '操作成功',
								icon:false
								// message: e.msg,
							})
							setTimeout(function(){
								uni.navigateBack();
							},2000)
						}else{
							this.show=false;
							this.$refs.uToast.show({
								type: 'error',
								title: res.msg,
								icon:false
								// message: e.msg,
							})
						}
					});
				}
				
			},
			express:function(){
				let id=this.id;
				expressAdjacentTools({
					id: id,
					image:this.image,
					memo:this.memo,
					status:1
				}).then(res=>{
					// console.log(res);
					if(res.code==200){
						this.$refs.uToast.show({
							title: '提取/配送成功',
							type: 'default', 
							icon: false
						})
						getAdjacentToolsDetail({
							id: this.id
						}).then(this.getDetail);
						
					}else{
						this.$refs.uToast.show({
							title: res.msg,
							type: 'default', 
							icon: false
						})
					}
					
				})
			}
		}
	}
</script>

<style lang="scss">
	.shadow_con{
		box-shadow: 0 0 15rpx #ddd;
		border-radius: 10rpx;
		color:#555;
	}
	.list{
		padding:20rpx 0;
	}
	.price_intro textarea{
		width:93%;
		height:150rpx;
		padding:20rpx;
		border-radius: 10rpx;
		font-size: 26rpx;
		border:1rpx solid #ddd;
	}
	.btn_con{
		height:70rpx;
		line-height: 70rpx;
		font-size: 30rpx;
		border-radius: 35rpx;
		background-image: url('https://resourse.cnlhjt.com/upload/20220825/d1aa35c1d129137d9b12c8f34e59c5bc.png');
		background-size: 100% 70rpx;
		color:#fff;
	}
</style>
